<html lang="zh"
      xmlns="http://www.w3.org/1999/xhtml"
      xmlns:th="http://www.thymeleaf.org">
<th:block th:fragment="page(pageInfo, url, formId,context_id)">
    <div class="page" style="margin: 10px 0">
        <div style="display: inline">
            <th:block th:if="${pageInfo.pages >0}">
                <th:block th:switch="${pageInfo.hasPreviousPage}">
                    <a class="prev" href="javascript:void(0);" th:case="true"
                       th:onclick="'go_to_page('+${pageInfo.prePage}+')'">上一页</a>
                    <a class="prev" href="javascript:void(0);" th:case="false" readonly>上一页</a>
                </th:block>
                <th:block th:each=" obj:${pageInfo.navigatepageNums}">
                    <th:block th:switch="${pageInfo.pages <= 9}">
                        <th:block th:case="true">
                            <th:block th:switch="${obj==pageInfo.pageNum}">
                                <span th:case="true" href="javascript:void(0);" th:text="${obj}" class="current"
                                      th:onclick="'go_to_page('+${obj}+')'"></span>
                                <a th:case="false" href="javascript:void(0);" th:text="${obj}" class="num"
                                   th:onclick="'go_to_page('+${obj}+')'"></a>
                            </th:block>
                        </th:block>
                        <th:block th:case="false">
                            <th:block th:switch="${(pageInfo.pageNum -1) >= 5}">
                                <th:block th:case="true">
                                    <th:block th:switch="${(pageInfo.pageNum + 4) >= pageInfo.pages}">
                                        <th:block th:case="true">
                                            <th:block th:if="${obj >= (pageInfo.pages -9) && obj <= pageInfo.pages}">
                                                <th:block th:switch="${obj==pageInfo.pageNum}">
                                                    <span th:case="true" href="javascript:void(0);" th:text="${obj}"
                                                          class="current" th:onclick="'go_to_page('+${obj}+')'"></span>
                                                    <a th:case="false" href="javascript:void(0);" th:text="${obj}"
                                                       class="num" th:onclick="'go_to_page('+${obj}+')'"></a>
                                                </th:block>
                                            </th:block>
                                        </th:block>
                                        <th:block th:case="false">
                                            <th:block th:if="${obj >= (pageInfo.pageNum -5) && obj <= (pageInfo.pageNum +4)}">
                                                <th:block th:switch="${obj==pageInfo.pageNum}">
                                                    <span th:case="true" href="javascript:void(0);" th:text="${obj}"
                                                          class="current"
                                                          th:onclick="'go_to_page('+${obj}+')'"></span>
                                                    <a th:case="false" href="javascript:void(0);" th:text="${obj}"
                                                       class="num"
                                                       th:onclick="'go_to_page('+${obj}+')'"></a>
                                                </th:block>
                                            </th:block>
                                        </th:block>
                                    </th:block>
                                </th:block>
                                <th:block th:case="false">
                                    <th:block th:switch="${(pageInfo.pageNum -5) >= 1}">
                                        <th:block th:case="true">
                                            <th:block th:if="${obj >= (pageInfo.pageNum -5) && obj <= 10}">
                                                <th:block th:switch="${obj==pageInfo.pageNum}">
                                                    <span th:case="true" href="javascript:void(0);" th:text="${obj}"
                                                          class="current"
                                                          th:onclick="'go_to_page('+${obj}+')'"></span>
                                                    <a th:case="false" href="javascript:void(0);" th:text="${obj}"
                                                       class="num"
                                                       th:onclick="'go_to_page('+${obj}+')'"></a>
                                                </th:block>
                                            </th:block>
                                        </th:block>
                                        <th:block th:case="false">
                                            <th:block th:if="${obj >0 && obj <= 9}">
                                                <th:block th:switch="${obj==pageInfo.pageNum}">
                                                    <span th:case="true" href="javascript:void(0);" th:text="${obj}"
                                                          class="current"
                                                          th:onclick="'go_to_page('+${obj}+')'"></span>
                                                    <a th:case="false" href="javascript:void(0);" th:text="${obj}"
                                                       class="num"
                                                       th:onclick="'go_to_page('+${obj}+')'"></a>
                                                </th:block>
                                            </th:block>
                                        </th:block>
                                    </th:block>
                                </th:block>
                            </th:block>
                        </th:block>
                    </th:block>
                </th:block>
                <th:block th:switch="${pageInfo.hasNextPage}">
                    <a href="javascript:void(0);" th:case="true" class="next"
                       th:onclick="'go_to_page('+${pageInfo.nextPage}+')'">下一页</a>
                    <a href="javascript:void(0);" class="next" th:case="false" readonly>下一页</a>
                </th:block>
            </th:block>
        </div>
        <div  style="display: inline;margin-left: 10px;color: #9d9d9d;" th:text="'共 '+${pageInfo.total}+' 条数据'" class="num"></div>
    </div>
    <script>
        var url = "[[${url}]]";
        var element_name_tmp = "[[${context_id}]]";
        var ajax_form_id = "[[${formId}]]";
        var currentPage = [[${pageInfo.pageNum}]];

        function go_to_page(page) {
            parent.obj = parent.layer.load(1);
            var ajax_form = document.getElementById(ajax_form_id);
            var context = document.getElementById(element_name_tmp);
            var other = $(ajax_form).serialize();
            $.post(url + "?" + other,
                {"pageNum": page, "ajax": true},
                function (data) {
                    $(context).html(data);
                }, "text");
        }

        function reloadCurrentPage() {
            go_to_page(currentPage);
        }

    </script>
</th:block>
</html>